// Dark preview styling

#preview {
  background-color: @grey-7;
  color:white;

  ul {
    .selected { background-color: @c-primary-shade; }

    li {
      border-top-color: @grey-4;
      border-bottom-color: @grey-4;

      p.filename { color: white; }
      p.snippet {
        .excerpt { color: @grey-2; }

        .date, .id, .tags, .directories, .files, .virtual-directories, .tex-indicator {
          background-color:@grey-4;
          color: @grey-0;
        }

        .tex-indicator { background-color: @c-primary; }

        .target-progress-indicator {
          circle { fill: @grey-4; }
          path { fill: @c-primary; }
        }
      }
    }

    li.file:hover {
      // important is needed to not mess with the heatmap styles and
      // to overwrite the light theme
      background-color:@grey-6 !important;
      p.filename { color: white !important; }
    }

    // File is displayed as part of a virtual directory -> actually
    // some kind of a "ghost" file
    li.vd-file { background-color:@purple-selection-dark; }

    li.directory, li.virtual-directory {
      background-color:@grey-8;
      color: @green-0;

      span.sortTime, span.sortName {
        background-color:@grey-7;

        &:hover {
          color: @grey-2;
          background-color:@grey-7;
        }
      }
    }

    li.virtual-directory { color:@purple-selection; }
  }
}
